<template>
    <div class="receiveDetail">
        <el-dialog title="领用明细" :visible="true" width="70%" @close="close">
            <el-table height="54vh" :data="list">
                <el-table-column property="name" label="物品" width="150"></el-table-column>
                <el-table-column property="number" label="数量" width="150"></el-table-column>
                <el-table-column property="username" label="领用人" width="200"></el-table-column>
                <el-table-column property="create_time" label="时间" width="200"></el-table-column>
                <el-table-column property="remark" label="备注"></el-table-column>
            </el-table>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" size="small" @click="dumpdata">导出</el-button>
                <el-button size="small" @click="close">关闭</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import {
  confirm,
  param2Obj
} from '@/utils/common'

import XLSX from 'xlsx'
export default {
    props: {
        id: {
            type: String / Number,
            default: ''
        }
    },
    data() {
        return {
            dumppage: 1,
            dumpshow: false,
            exceldata: [],
            percentage: 0,
            ws: {},
            filename: '',
            list: [],
        }
    },
    created() {
        this.getList()
    },
    methods: {
        getList() {
            //   const param = {
            //     path: this.$route.path,
            //     limit: this.page_data.limit,
            //     page: this.page_data.page
            //   }
            //   Object.assign(param, this.searchData)
            //   Object.assign(param, param2Obj(this.$route.fullPath))
            this.loading = true
            this.$api.post('/Stock/gotdetail', { id: this.id }).then(res => {
                console.log(res)
                this.list = res.data
                // this.page_data.total = res.data.total
                this.loading = false
            })
        },
        exportData() {

        },
        dumpdata() {
            confirm({
                content: '确定要操作吗'
            }).then(() => {
                this.dumpshow = true
                this.confirmdumpdata()
            }).catch(() => { })
        },
        confirmdumpdata() {
            let param = {
                id:this.id,
                path: this.$route.path,
                page: this.dumppage
            }
            if (this.searchData) param = Object.assign(param, this.searchData)
            this.$api.post('/Stock/dumpgotdata', param).then(res => {
                console.log(res, 666)
                if (res.data.length > 0) {
                    if (this.dumppage == 1) {
                        this.exceldata.push(res.header)
                    }
                    res.data.forEach((item) => {
                        this.exceldata.push(Object.values(item))
                    })
                    this.percentage = res.percentage
                    this.filename = res.filename
                    this.ws = XLSX.utils.aoa_to_sheet(this.exceldata)
                    this.dumppage = this.dumppage + 1
                    this.confirmdumpdata()
                } else {
                    const wb = XLSX.utils.book_new()
                    XLSX.utils.book_append_sheet(wb, this.ws, '资料')
                    XLSX.writeFile(wb, this.filename)
                    this.dumpshow = false
                }
            })
        },
        close() {
            this.$emit('colse')
        }
    }
}
</script>

<style lang="scss">
.receiveDetail {}
</style>